.product-card {
	position: relative;
	height: 280px;
	.product-container {
		position: absolute;
		width: 100%;
		height: 100%;
		.master-row {
			line-height: 30px;
			.product-img {
				width: 70px;
				height: 70px;
				.product-icon {
					width: 100%;
				}
			}
		}
		.left {
			min-width: 300px;
			max-width: 300px;
			height: 200px;
			padding-left: 40px;
			background: #fbfbfb;
			background-image: url("../../../../public/images/decoration/3.png");
			background-repeat: no-repeat;
			background-position: center;
			background-size: 100% 100%;
			border-right: 1px solid #e4e7ed;
			border-radius: 3px 0 0 3px;
			.img {
				width: 36px;
				height: 36px;
				margin-top: 40px;
			}
			.title {
				margin-top: 10px;
				font-size: 20px;
				font-weight: 700;
				color: #000000;
				text-align: left;
			}
		}
		.body {
			position: relative;
			flex: 1;
			line-height: 35px;
			color: #333333;
			.label {
				min-width: 70px;
			}
			.text {
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
			}
		}
	}
	.bg {
		position: absolute;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
	}
}
.product-card:hover {
	.bg {
		animation: scale-img 5s ease-in-out infinite;

		// background-image: url("../../../../public/images/decoration/4.png");
		// background-repeat: no-repeat;
		// background-position: right bottom;
		// background-size: cover;
	}
	.card-container {
		background-color: #00000010;
		box-shadow: 5px 15px 10px #cccccc;
	}
	@keyframes scale-img {
		0% {
			transform: scale(1);
		}
		25% {
			transform: translate(0, 0) scale(1.2);
		}
		50% {
			transform: scale(1);
		}
		75% {
			transform: translate(0, 0) scale(1.2);
		}
	}
}
.product-detail-page {
	height: calc(100% - 40px);
}
.bg.cover-img {
	position: relative;
	.config-topo {
		top: 50%;
		left: 50%;
		display: none;
		transform: translate(-50%, -50%);
	}
	&:hover {
		background-color: #00000030;
		.config-topo {
			display: flex;
		}
	}
}
